<!--<template>-->
<!--  <el-tabs-->
<!--      v-model="val"-->
<!--      v-bind="$attrs"-->
<!--      v-on="$listeners"-->
<!--  >-->
<!--    <template v-for="(index, name) in $slots" :slot="name">-->
<!--      <slot :name="name"></slot>-->
<!--    </template>-->
<!--  </el-tabs>-->

<!--</template>-->

<script>
import ElTabs from 'element-ui/packages/tabs/src/tabs'
export default {
  name: "MTabs",
  data() {
    return {
    }
  },
  extends: ElTabs,
  components: {},
  mounted() {
  },
  methods: {
    calcPaneInstances(isForceUpdate = false) {
      if (this.$slots.default) {
        const paneSlots = this.$slots.default.filter(vnode => vnode.tag &&
            vnode.componentOptions && (vnode.componentOptions.Ctor.options.name === 'MTabPane' || vnode.componentOptions.Ctor.options.name === 'ElTabPane'));
        // update indeed
        const panes = paneSlots.map(({ componentInstance }) => componentInstance);
        const panesChanged = !(panes.length === this.panes.length && panes.every((pane, index) => pane === this.panes[index]));
        if (isForceUpdate || panesChanged) {
          this.panes = panes;
        }
      } else if (this.panes.length !== 0) {
        this.panes = [];
      }
    },
  }
}
</script>

<style lang="scss" scoped>

</style>